const target = {
  count: 0,
  user:{
    name:'jim',
    gender:'male'
  }
}

function isObject(target:any) {
  return typeof target === 'object' && target !== null
}

function createReactiveObj(target:object, deep:boolean=true) {
  return new Proxy(target, {
    get(target, p, receiver) {
      console.log(`[getter]: ${String(p)}`)
      const value = Reflect.get(target, p, receiver)
      return isObject(value) && deep ? createReactiveObj(value) : value
    },
  
    set(target, p, newValue, receiver) {
      console.log(`[setter]: ${String(p)} = ${newValue} `)
      return Reflect.set(target, p, newValue, receiver)  
    }
  }) 
}



window.data = createReactiveObj(target)
